/**
 * Requisites for an XForm to conform to the below script
 * Row 1 - Should have a label with the application name. The id of the label should be "fld_ApplicationHeader"
 * Row 1 - In the row, place a label with the content "User Name" and id "fld_UserName" in the place where the 
 *         user name, user id etc is to be shown
 * Row 2 - The application tabs will come here. Place a label with the id "fld_tabs". Contents for this tab has to be
 *         filled from the application
 * @param {Object} "head"
 */

if(!window["vg"]) {
	vg = {};
}

if(!vg.cpfdesktop) {
	vg.cpfdesktop = {};
}

(function() {
	//HTML to transform the top CPF bar
	var topHTML = '<div customType="userlinkcontainer"><div style="margin-right: 37px;"><a href="javascript:void(0)" id="customProfile">{UserName}<br>{UserID}</a></div><div><div><a href="javascript:void(0)" style="font-weight: bold;" id="customChangeApplication">Change Application</a></div><div><a href="javascript:void(0)" style="font-weight: bold;" id="customLogOut">Log out</a></div></div></div>';
	
	//Attching Nexera POC Style stored in Script Upload
    var headElmt = document.getElementsByTagName("head")[0];
    var style = document.createElement("link");
    style.href = "https://vsdevelop.tpfcloud.com/cordys/uc/webapps/UploadedFiles/vsdevelop/Picture Images/xf62e1ccaa-0ae9-1584-003b-c1a1649ab379/fld_ScriptFiles/SPT0000016.css";
    style.rel = "stylesheet";
    style.type = "text/css";
    headElmt.appendChild(style);
	var desktopDoc = top.document.getElementById("desktop").contentWindow.document;
	if(!top.stylesAttached) {
		top.stylesAttached = true;
		desktopDoc.getElementsByTagName("head")[0].appendChild(style.cloneNode(true));
	}	
    var breadDoc = desktopDoc.getElementById("breadcrum").contentWindow.document;
    breadDoc.getElementsByTagName("head")[0].appendChild(style.cloneNode(true));
    var footerDoc = desktopDoc.getElementById("footercopyright").contentWindow.document;
    footerDoc.getElementsByTagName("head")[0].appendChild(style.cloneNode(true));
	var myProfileDiv = desktopDoc.getElementById("myProfileDiv");
	document.getElementsByTagName("body")[0].className = "nex-desktop";
    setUserData();
	storeTabs();	

	function setUserData() {
	    var userName = breadDoc.getElementById("loginName").innerHTML.replace(/Welcome\s(.*?)!/, "$1");
	    topHTML = topHTML.replace("{UserID}", GlobalVariables.currentuser);
	    topHTML = topHTML.replace("{UserName}", userName);
	    fld_UserName.parentNode.innerHTML = topHTML;
	    document.getElementById("customLogOut").onclick = function () {
	        click(breadDoc, "[title='Log Out']")
	    }    
	    document.getElementById("customChangeApplication").onclick = function () {
	        click(breadDoc, "[title='Click here to change Application']")
	    } 
	    document.getElementById("customProfile").onclick = function () {
	        click(breadDoc, "[title='View Profile']");
	        var popupWidth = myProfileDiv.offsetWidth;
			var userNamePos = document.querySelector("[title='User Name']").parentNode.parentNode.offsetLeft;
	        myProfileDiv.style.left = (userNamePos - popupWidth)+ "px";
	    }
	
	}
	
	function click(doc, selector) {
	        var clickEvt = getClickEvt(doc);
	        var elmt = doc.querySelector(selector);
	        elmt.dispatchEvent(clickEvt);     
	}
	
	function getClickEvt(doc) {
		var clickEvt = doc["createEvent"]("MouseEvents");
		clickEvt.initMouseEvent("click", true, true, undefined, 0, 0, 0, 0, 0, false, false, false, false, 0, null)
		return clickEvt;	
	}
	
	function storeTabs() {
		top.__applicationTabs = {};
		var tabDivs = breadDoc.querySelector("[class = 'mainTabs']").childNodes;
		for(var i = 0; i < tabDivs.length; i++) {
			top.__applicationTabs[tabDivs[i].innerHTML] = tabDivs[i];
		}
	}
	
	vg.cpfdesktop.Tabs = function (container, tabs) {
		container.innerHTML = '<div class="custom_tabs"></div>';
		this.tabContainer = container.childNodes[0];
		this.tabConfig = tabs;
		this.tabs = {};
		var clickEvt = getClickEvt(breadDoc);
		for(var i = 0; i < tabs.length; i++) {
			var linkElmt = document.createElement("a");
			linkElmt.href = "javascript:void(0)";
			linkElmt.innerHTML = tabs[i]["displayName"];
			this.tabs[tabs[i]["tabName"]] = linkElmt;
			linkElmt.onclick = (function(tabName, tabObj) {
				return function(eventObject) {
					try {debugger;
						var charts = document.querySelectorAll(".google-chart");
						for(var i = 0; i< charts.length; i++) {
							charts[i].parentNode.removeChild(charts[i]);
						}
						top.__applicationTabs[tabName].dispatchEvent(clickEvt);					
					} catch(ex) {						
					}
					for(var i in tabObj.tabs) {
						this.className = (i == tabName) ? "active" : "";
					}
				}
			})(tabs[i]["tabName"], this);
			tabs[i]["isActive"] && (linkElmt.className = "active");
			this.tabContainer.appendChild(linkElmt);
		}
	}
})();
scriptCallback && scriptCallback("Nexera POC");